$(document).ready(init);

function init() {
    $('.hub').hub();
    
    $('a.iframe-fancy').fancybox({
        type: "iframe",
        autoSize: true,
        margin: 0,
        padding: 0,
        helpers: {
            title:{
                type: "inner",
                position: "top"
            }
        },
        afterClose: function(){
            location.href = location.href;
        }
    });    
    
    var timer = $("span.time");
    var expr = /\d{2}\:\d{2}\:\d{2}/;
    var interval = setInterval(function(){        
        timer.text(expr.exec(new Date().toString()));
    }, 1000);
}

$.fn.hub = function() {
    function run() {
        var root = $(this);
        var hub = root.children('ul');

        hub.each(function() {
            var item = $(this);
            var plates = item.children('li');
            var delta = plates.outerWidth();
            item.width(plates.length * delta);
                       
            item.draggable({
                axis: "x",
                stop: function(e, ui) {
                    var offset = ui.offset.left;
                    var steps = Math.round(offset / delta) * delta;
                    var itemWidth = Math.round(root.width());
                    if (steps >= itemWidth-delta) {
                        steps = itemWidth-delta;
                    }

                    if (steps < -itemWidth) {
                        steps = delta - item.width();
                    }
                    var move = item.width() > root.width();
                    
                    if (move) {
                        item.animate({left: steps}, 300);
                    }else{
                        item.animate({left: 0}, 300);
                    }
                }
            });
        });
    }

    return this.each(run);
}